<script setup lang="ts">
import { RouterView } from "vue-router";
import { darkTheme } from "naive-ui";
import { NConfigProvider } from "naive-ui";
import { NLayout } from "naive-ui";
import { NLayoutContent } from "naive-ui";
import { NLayoutFooter } from "naive-ui";
import { NDialogProvider } from "naive-ui";
</script>

<template>
  <n-config-provider :theme="darkTheme" class="w-full h-full">
    <n-dialog-provider>
      <n-layout class="w-full h-full">
        <n-layout-content class="n-layout-content">
          <router-view />
        </n-layout-content>
        <n-layout-footer class="n-layout-footer">
          预留备案信息
        </n-layout-footer>
      </n-layout>
    </n-dialog-provider>
  </n-config-provider>
</template>

<style>
html,
body {
  height: 100%;
}
#app {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  padding: 0;
}
</style>

<style scoped>
.n-layout-footer {
  height: 60px;
}
.n-layout-content {
  height: calc(100% - 60px);
  overflow: auto;
}
</style>
